Add webpack dev server

This commit is contained in:
Baptiste Grob
2020-03-11 16:46:01 +01:00
parent fd94a201b0
commit bbceed8c42
6 changed files with 1344 additions and 5 deletions

3
.gitignore vendored
View File

@@ -31,6 +31,9 @@ dump.rdb
# Ignore compiled assets # Ignore compiled assets
/public/assets /public/assets
# Ignore dev index.html file
/public/index.html
# Ignore user uploads # Ignore user uploads
/public/uploads/* /public/uploads/*
!/public/uploads/.keep !/public/uploads/.keep

View File

@@ -60,8 +60,9 @@ This repo contains the core code used in the web app, as well as the Electron-ba
**Instructions:** **Instructions:**
1. Clone the repo 1. Clone the repo
1. `npm run build` 2. `cp dev-index.html public/index.html`
1. `rails s` 3. `npm install`
4. `npm start`
Open your browser to http://localhost:3000. Open your browser to http://localhost:3000.
@@ -69,7 +70,7 @@ Open your browser to http://localhost:3000.
**Extensions Manager and Batch Manager:** **Extensions Manager and Batch Manager:**
The web app makes use of two optional native extensions, which can be configured to work as follows: The web app makes use of two optional native extensions, which, when running the app with Rails, can be configured to work as follows:
1. `git submodule update --init --force --remote` (will load the submodules in the `public/extensions` folder) 1. `git submodule update --init --force --remote` (will load the submodules in the `public/extensions` folder)
1. Set the following environment variables in the .env file: 1. Set the following environment variables in the .env file:

34
dev-index.html Normal file
View File

@@ -0,0 +1,34 @@
<!-- <!DOCTYPE html> -->
<html ng-app="app">
<head>
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<link href="favicon/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180">
<link href="favicon/favicon-32x32.png" rel="icon" sizes="32x32" type="image/png">
<link href="favicon/favicon-16x16.png" rel="icon" sizes="16x16" type="image/png">
<link href="favicon/site.webmanifest" rel="manifest">
<link color="#5bbad5" href="favicon/safari-pinned-tab.svg" rel="mask-icon">
<meta name="theme-color" content="#ffffff">
<meta ng-bind="title" content="Standard Notes" name="apple-mobile-web-app-title">
<meta ng-bind="title" content="Standard Notes" name="application-name">
<title>Notes · Standard Notes</title>
<script>
window._default_sf_server = "https://sync.standardnotes.org";
window._extensions_manager_location = "extensions/extensions-manager/dist/index.html";
window._batch_manager_location = "extensions/batch-manager/dist/index.min.html";
</script>
<!-- Generated files -->
<link rel="stylesheet" media="all" href="stylesheets/app.css">
<script src="javascripts/app.js"></script>
</head>
<body>
<root />
</body>
</html>

1296
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -7,7 +7,7 @@
"url": "https://github.com/standardnotes/web" "url": "https://github.com/standardnotes/web"
}, },
"scripts": { "scripts": {
"start": "webpack --mode development -w", "start": "webpack-dev-server",
"bundle": "webpack --mode production", "bundle": "webpack --mode production",
"build": "bundle install && npm install && npm run bundle", "build": "bundle install && npm install && npm run bundle",
"submodules": "git submodule update --init --force --remote", "submodules": "git submodule update --init --force --remote",
@@ -49,7 +49,8 @@
"sn-stylekit": "2.0.20", "sn-stylekit": "2.0.20",
"snjs": "1.0.6", "snjs": "1.0.6",
"webpack": "^4.41.5", "webpack": "^4.41.5",
"webpack-cli": "^3.3.10" "webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.3"
}, },
"dependencies": { "dependencies": {
"lodash": "^4.17.15" "lodash": "^4.17.15"

View File

@@ -7,6 +7,10 @@ module.exports = {
output: { output: {
filename: './javascripts/app.js' filename: './javascripts/app.js'
}, },
devServer: {
contentBase: path.resolve(__dirname, 'public'),
port: 3000
},
plugins: [ plugins: [
new webpack.DefinePlugin({ new webpack.DefinePlugin({
__VERSION__: JSON.stringify(require('./package.json').version) __VERSION__: JSON.stringify(require('./package.json').version)