Simplify sample, update npm deps to remove npm security errors

This commit is contained in:
Alex Dima 2019-08-14 16:05:10 +02:00
parent 27b10e31fa
commit c79ea537b5
7 changed files with 373 additions and 2383 deletions

View file

@ -0,0 +1 @@
dist/*.js

View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head>
<body>
<script src="./main.bundle.js"></script>
</body>
</html>

View file

@ -11,20 +11,11 @@
To run this sample, you need to: To run this sample, you need to:
<pre> <pre>
$/browser-esm-webpack-monaco-plugin> npm install $/browser-esm-webpack> npm install .
$/browser-esm-webpack-monaco-plugin> npm run start $/browser-esm-webpack> ./node_modules/.bin/webpack
# or to build for production
$/browser-esm-webpack-monaco-plugin> npm run build
</pre> </pre>
If you're building for production you need to statically serve the files: Then, <a href="./dist">open the ./dist folder</a>.
<pre>
$/browser-esm-webpack-monaco-plugin> npm run build
$/browser-esm-webpack-monaco-plugin> cd dist
$/browser-esm-webpack-monaco-plugin/dist> npx static-server -p 3000 -o
</pre>
</body> </body>
</html> </html>

View file

@ -1,4 +1,4 @@
import * as monaco from "monaco-editor"; import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
(function () { (function () {
// create div to avoid needing a HtmlWebpackPlugin template // create div to avoid needing a HtmlWebpackPlugin template

File diff suppressed because it is too large Load diff

View file

@ -6,21 +6,17 @@
"private": true, "private": true,
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack-dev-server --progress --mode development", "build": "webpack --progress"
"build": "webpack --progress --mode production"
}, },
"keywords": [], "keywords": [],
"author": "", "author": "",
"license": "ISC",
"devDependencies": { "devDependencies": {
"css-loader": "^2.1.1", "css-loader": "^3.2.0",
"file-loader": "^3.0.1", "file-loader": "^4.2.0",
"html-webpack-plugin": "^3.2.0",
"monaco-editor-webpack-plugin": "^1.7.0", "monaco-editor-webpack-plugin": "^1.7.0",
"style-loader": "^0.23.1", "style-loader": "^1.0.0",
"webpack": "^4.32.0", "webpack": "^4.39.2",
"webpack-cli": "^3.3.2", "webpack-cli": "^3.3.6"
"webpack-dev-server": "^3.4.1"
}, },
"dependencies": { "dependencies": {
"monaco-editor": "^0.16.2" "monaco-editor": "^0.16.2"

View file

@ -1,43 +1,22 @@
const path = require("path"); const path = require("path");
const MonacoWebpackPlugin = require("monaco-editor-webpack-plugin"); const MonacoWebpackPlugin = require("monaco-editor-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = { module.exports = {
mode: process.env.NODE_ENV, mode: process.env.NODE_ENV,
entry: "./index.js", entry: "./index.js",
output: { output: {
path: path.resolve(__dirname, "dist"), path: path.resolve(__dirname, "dist"),
filename: "[name].bundle.js", filename: "[name].bundle.js",
}, },
module: { module: {
rules: [ rules: [{
{ test: /\.css$/,
test: /\.css$/, use: ["style-loader", "css-loader",],
use: [ }],
"style-loader", },
"css-loader", plugins: [
], new MonacoWebpackPlugin({
}, languages: ["typescript", "javascript", "css"],
{ })
test: /\.(png|jpg|gif|svg|woff2?|ttf|eot|otf)$/, ]
use: [
{
loader: "file-loader",
},
],
},
],
},
plugins: [
new MonacoWebpackPlugin({
languages: ["typescript", "javascript", "css"],
}),
new HtmlWebpackPlugin()
],
devServer: {
port: 4000,
hot: process.env.NODE_ENV === 'development',
open: true
},
devtool: process.argv.includes("--use-sourcemaps") ? "inline-source-map" : false,
}; };